<template>
  <el-select
    v-model="selectId"
    clearable
    filterable
    :placeholder="$language.local('请选择') + $language.local('服务商')"
    @change="selectChange"
  >
    <el-option
      v-for="item in services"
      :key="item.Id"
      :label="item.ServiceName"
      :value="item.Id"
    >
    </el-option>
  </el-select>
</template>

<script>
export default {
  name: "SelectService",
  props: {
    value: [Number, String],
  },
  data() {
    return {
      selectId: Number(this.value) || "",
      services: [],
    };
  },
  created() {
    this.getServices();
  },
  watch: {
    // value(newValue) {
    //   this.selectId = Number(newValue);
    // },
  },
  methods: {
    async getServices() {
      let response = await this.$http.get("/api/Common/GetServiceProviderList");
      this.services = response.data.Data;
    },
    selectChange(e) {
      this.$emit("input", e);
    },
  },
};
</script>
<style lang="less" scoped>
.el-select {
  width: 100%;
}
</style>
